import React, { useState, useCallback, useEffect } from "react";

import CommonPagination from "@/components/CommonPagination";

// 组件 pagination 的 属性
const initPagination = {
	current: 1, //当前 页码 // 从1开始
	total: 0, //数据总量
	pageSize: 20, //每页条数

	showQuickJumper: true,
	pageSizeOptions: [10, 20, 50, 500]
};

/**
 * paginationProps.pagination
 * paginationProps.handleChange
 */
export default React.memo(({ pagination, handleChange }) => {
	const ComponentName = "TableFooter";
	if (!pagination || !handleChange) {
		return <>TableFooter 需要提供 pagination 和 handleChange</>;
	}
	useEffect(() => {
		console.warn(`${ComponentName},初始化`);
	}, []);

	const showQuickJumper = pagination.showQuickJumper && Number(String(pagination.total || 0)) > (pagination.pageSize || 50);

	return (
		<div className="views-footer">
			<CommonPagination
				pagination={{ ...pagination, current: Number(pagination.current), showQuickJumper }}
				handleChange={handleChange}
			/>
		</div>
	);
});
